<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>更新用户</title>
	<link rel="stylesheet" type="text/css" href="css/adminContent.css" />
	<!-- 导入 Vue 3 -->
	<script src="//unpkg.com/vue@next"></script>
	<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
	<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<div class="body">
	<form name="form1" id="form1">
		<table width="100%" cellspacing="0">
			<tr><td colspan="2" style="text-align: center;color: red;" id="tip" v-html="tip"></td></tr>
			<h1 style="text-align: center">更新用户</h1>
			<tr>
				<td width="46%">账号</td>
				<td><input v-model="user.uid" disabled="disabled" name="uid"  value="user.uid"/><span ></span></td>
			</tr>
			<tr>
				<td>用户名</td>
				<td><input v-model="user.uname"  name="uname"/><span ></span></td>
			</tr>
			<tr>
				<td>手机号</td>
				<td><input v-model="user.uphone"   /><span ></span></td>
			</tr>
			<tr>
				<td>邮箱</td>
				<td><input v-model="user.uemail"  /><span ></span></td>
			</tr>
			<tr>
				<td colspan="2" id="btnPanel">
					<input type="button" value="更新" @click="doUpdate(user.uid)"/>
					<input type="button" value="清空" @click="doClear()"/>
				</td>
			</tr>
		</table>
	</form>
</div>
</body>
<script src="../js/jquery-1.8.0.min.js" type="text/javascript" charset="utf-8"></script>
<script>
	Vue.createApp({
		data(){
			return {
				user:{
					uid:'',
					uname:'',
					uphone:'',
					uemail:'',
				},
				tip:'&nbsp;'
			}
		},
		methods:{
			doUpdate(id){

				axios({
					method:'post',
					url:'/person/update',
					params:{
						uid:id,
						uname:this.user.uname,
						uphone:this.user.uphone,
						uemail:this.user.uemail
					}
				}).then(res => {
					let ret = res.data;
					if(ret == true){
						this.tip = "更新成功！";
					}else{
						this.tip = "更新失败！";
					}
				});
			},
			doClear() {
                this.user = {
					uid:'',
					uname:'',
					uphone:'',
					uemail:'',
                }
            }
		},
		created(){
			let id= sessionStorage.getItem("uid");
			axios({
				method:'post',
				url:'/person/selectPerson?uid=' + id,

				params: {
					uid:this.user.uid
				}
			}).then(res => {

				let user = res.data;
				this.user.uid = user.uid;
				this.user.uname = user.uname;
				this.user.uphone = user.uphone;
				this.user.uemail = user.uemail
			});
		}
	}).mount("#form1");
</script>
</html>
    